<template>
  <page-header-wrapper :title="false">
    <a-card title="消息详情">
      <template #extra> <a-button type="primary" @click="handledelete()" :loading="loading">删除消息</a-button></template>
      <a-descriptions bordered title="" size="small">
        <a-descriptions-item label="消息类型" :span="3"> {{ info?.msgCls }} </a-descriptions-item>
        <a-descriptions-item label="消息标题" :span="3"> {{ info?.msgTitle }} </a-descriptions-item>
        <a-descriptions-item label="消息内容" :span="3"> {{ info?.msgContent }} </a-descriptions-item>
        <a-descriptions-item label="消息状态" :span="3"> {{ info.msgStatus == '0' ? '未读' :'已读' }} </a-descriptions-item>
        <a-descriptions-item label="消息时间" :span="3"> {{ info?.msgTime }} </a-descriptions-item>
        <a-descriptions-item label="操作" :span="3">
          <div style="display: flex">
            <a-button type="primary" style="margin: 0px 5px" @click="handleDetail(info)" >跳转至详情</a-button>
          </div>
        </a-descriptions-item>
       
      </a-descriptions>
    </a-card>
  </page-header-wrapper>
</template>
  
  <script>
import {
    getMyMsgUsingPOST,
    deleteMyMsgUsingPOST
} from '@/api/api/wode.ts'
export default {
  name: 'MessageDetail',
  components: {},
  data() {
    return {
      info: {},
      mdl: null,
      visible: false,
      confirmLoading: false,
      turnMdl: null,
      turnVisible: false,
      turnConfirmLoading: false,
      queryParam: {
        pageNo: 1,
        pageSize: 10,
        orderId: this.$route.params.id,
        queryCondition: '',
        status: '',
      },
      loading: false,
      pagination: {},
      advanced: false,
      loadData: [],
    }
  },
  created() {
    this.getDetail()
  },
  methods: {
    handleDetail(info){
      this.$router.push({ path: `/service/service/detail/${info.msgUrl}` })
    },
    handledelete(){
      const that = this
      that.$confirm({
        title: '删除消息',
        content: '你确定要删除该消息吗？',
        okText: '确认',
        okType: 'danger',
        cancelText: '取消',
        onOk() {
          that.loading = true
          deleteMyMsgUsingPOST({ id: that.$route.params.id  })
            .then(() => {
              that.$router.back()
              that.loading = false
              that.$message.success('操作成功')
            })
            .catch((error) => {
              that.loading = false
              that.$message.error(((error.response || {}).data || {}).msg || '请求出现错误')
            })
        },
      })
    },
    getDetail() {
        getMyMsgUsingPOST({ id: this.$route.params.id })
        .then((res) => {
          this.info = res.data
        })
        .catch((error) => {
          this.$message.error(((error.response || {}).data || {}).msg || '请求出现错误')
        })
    },
  },
}
</script>
  